/* You can add global styles to this file, and also import other style files */
@import '../node_modules/weui/dist/style/weui.min.css';
//@import './assets/weui.page.min.css';
@import '../node_modules/font-awesome/css/font-awesome.min.css';

.container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    background-color: #f8f8f8;
}

small {
    color: #888888;
}

.block- {
    display: block;
    &20 {
        width: 20px;
    }
    &50 {
        width: 50px;
    }
}
.fa {
    text-align: center;
    &.block-20 {
        font-size: 20px;
    }
    &.block-50 {
        font-size: 50px;
    }
}

.chat-container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 999;
    overflow: auto;
    background-color: #f8f8f8;
}
.chat-input {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}
.chat-msg__bg {
    bottom: 60px;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    overflow: auto;
}
.chat-msg {
    clear: both;
    &__me {
        float: right;
        table-layout: fixed;
        position: relative;
        margin: 10px;
        padding: 5px;
        word-break: break-all;
        border-radius: 8px;
        background-color: forestgreen;
        color: white;
    }
    // &__me:before {
    //     content: '';
    //     position: absolute;
    //     width: 0;
    //     height: 0;
    //     left: 15px;
    //     top: -20px;
    //     border: 10px solid;
    //     border-color: transparent transparent #989898 transparent;
    // }
    // &__me:after {
    //     content: '';
    //     position: absolute;
    //     width: 0;
    //     height: 0;
    //     left: 17px;
    //     top: -16px;
    //     border: 8px solid;
    //     border-color: transparent transparent #ffffff transparent;
    // }
    &__right {
        display: inline-block;
    }
}